require(['./config'],()=>{
	require(['template','header','footer','jquery'],(template,header)=>{
		class Car{
			constructor(){
				this.render()
				if(this.car){
					this.setALLCheckStatus()
					this.calcTotalMoney()
					this.checksChange()
					this.All()
					this.allcheck()
				}
			}
			render(){
				const car=localStorage.getItem('car')
				if(car){
					this.car=JSON.parse(car)
					$('#car-table').html(
					template('car-table_template',{
						car:this.car
					}))
				}else{
					$('#car-empty').show()
					$('#have').hide()
				}
				header.calcCarCount()
				this.All()
				this.count()
				this.checksChange()
			}
			setALLCheckStatus(){
				const isALLCheck=this.car.every(shop=>shop.check)
				$('#all-check').prop('checked',isALLCheck)
			}
			calcTotalMoney(){
				const allMoney=this.car.reduce((money,shop)=>{
					if(shop.check) {
						money += shop.price*shop.count
					}
					//无论条件是否满足都要return
					return money
				},0)
				$('#all').html(allMoney.toFixed(2))
			}
			All(){
				const _this=this
				$('.delete').on('click',function(){
					const id=$(this).parents('tr').data('id')
					_this.car=_this.car.map(shop=>{
						if(shop.id===id){
							let str=localStorage.getItem('car')
							let obj=JSON.parse(str)
							for(var i=0;i<obj.length;i++){
								if(obj[i].id===id){
									obj.splice(i,1)
									_this.car=obj
									if(obj.length===0){
										window.localStorage.removeItem('car')
									}else{
										localStorage.setItem('car',JSON.stringify(_this.car))
									}
									_this.render()
								}
							}
						}
						return shop
					})
					_this.render()
					_this.setALLCheckStatus()
					_this.calcTotalMoney()
				})
			}
			allcheck(){
				const _this=this
				$('#all-check').on('change',function(){
					_this.car=_this.car.map(shop=>{
						shop.check=$(this).prop('checked')
						return shop
					})
					localStorage.setItem('car',JSON.stringify(_this.car))
					_this.render()
					_this.setALLCheckStatus()
					_this.calcTotalMoney()
					_this.checksChange()
				})
			}
			checksChange(){
				const _this=this
				$('.check').on('change',function(){
					const id=$(this).parents('tr').data('id')
					_this.car=_this.car.map(shop=>{
						if(shop.id===id){
							shop.check=$(this).prop('checked')
						}
						return shop
					})
					
					localStorage.setItem('car',JSON.stringify(_this.car))
					_this.render()
					_this.setALLCheckStatus()
					_this.calcTotalMoney()
				})
			}
			count(){
				const _this=this
				$('.jian').on('click',function(){
					const id=$(this).parents('tr').data('id')
					_this.car=_this.car.map(shop=>{
						if(shop.id===id){
							shop.count--
							if(shop.count<=0){
								shop.count=1
							}
						}
						return shop
					})
					localStorage.setItem('car',JSON.stringify(_this.car))
					_this.render()
					_this.setALLCheckStatus()
					_this.calcTotalMoney()
				})
				$('.jia').on('click',function(){
					const id=$(this).parents('tr').data('id')
					_this.car=_this.car.map(shop=>{
						if(shop.id===id){
							shop.count++
						}
						return shop
					})
					localStorage.setItem('car',JSON.stringify(_this.car))
					_this.render()
					_this.setALLCheckStatus()
					_this.calcTotalMoney()
				})
			}
		}
		new Car()
	})
})